<template>
	<view class="main_container">
		<u-tabs style="width: 100%" :list="typeList" @click="click"></u-tabs>
		<u--form :model="queryParams">
			<u-form-item>
				<u--input v-model="queryParams.name" placeholder="请输入关键字搜索"></u--input>
				<u-button slot="right" text="搜索" type="primary" @click="goSearch"></u-button>
			</u-form-item>
		</u--form>
		<view class="no-data" v-if="memberList.length == 0" @click="listTechperson">
			<!-- <image mode="aspectFit" class="no-data-img"></image> -->
			{{ noData }}
		</view>
		<scroll-view class="member_lsit" scroll-y="true" :style="'height:100%'" enable-flex  @scrolltolower="scrollToLower()" @scrolltoupper="updateOrderInfo()">
			<view v-show="item.companyName" class="video_item" v-for="(item,index) in memberList" :key="index" @click="rencaiDetail(memberList[index])">
				<!-- <image class="video_img" :src="item.image"></image> -->
				<view class="video_content">
					<view style="width: 100%;">
						<text class="video_title">{{item.companyName}}</text>
						
					</view>
					<view style="width: 100%; margin-top: 18rpx; font-size: 28rpx;float: left;">
						<text style="">所属区域：{{item.areaName}}</text>
						<text class="publicTime">企业类型：{{item.typeName}}</text>
					</view>
					<!-- <view style="width: 100%; margin-top: 18rpx; font-size: 28rpx;float: left;">
						<text style="">单位名称：{{item.companyName}}</text>
					</view> -->
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import env from '@/utils/env.js'
	import *  as company from "@/api/innovate/company.js";
	import * as basic from '@/api/innovate/BASIC.js'
	import * as dict from '@/api/system/dict/data.js'
	import uniTag from "@/components/uni-tag/components/uni-tag/uni-tag.vue"
	
	import { codeList } from "@/utils/code";
	import {
		defineComponent
	} from "vue";
	export default {
		components:{
			uniTag
		},
		data() {
			return {
				title: '',
				memberList:[],
				currentType:0,
				researchDirection:[
					
				],
				areaData:[],
				query:{
					pageSize: 10,
					pageNum: 1
				},
				total:0,
				noData:'加载中',
				typeList:[
					{
						name:'全部',
						value:null
					},
				],
				activeType:null,
				queryParams:{}
			}
		},
		onLoad(option) {
			this.listTechperson()
			uni.showLoading({})
			this.getDict()
		},
		methods:{
			click(item){
				this.query.pageNum = 1
				this.memberList = []
				this.activeType = item.value
				this.listTechperson()
			},
			goSearch(){
				this.memberList = []
				this.query.pageNum = 1
				this.listTechperson()
			},
			getDict(){
				dict.getDicts("stpi_qiye_type").then((res)=>{
					if(res.data && res.data.length>0){
						this.researchDirection = res.data
						res.data.forEach(item=>{
							this.typeList.push({
								name:item.dictLabel,
								value:item.dictValue
							})
						})
					}
				})
				dict.getDicts("ent_area").then((res)=>{
					if(res.data && res.data.length>0){
						this.areaData = res.data
					}
				})
			},
			listTechperson(){
				this.noData = '加载中。。。'
				let data = this.query
				if(this.activeType){
					data.type = this.activeType
				}else{
					delete data.type
				}
				if(this.queryParams.name){
					data.companyName = this.queryParams.name
				}else{
					delete data.companyName
				}
				console.log(data);
				basic.listBASIC(this.query).then((res)=>{
					res.rows.forEach(v => {
						this.memberList.push(v)
					})
					uni.hideLoading({})
					console.log(this.memberList)
					this.total = res.total
					if(this.memberList.length===0){
						this.noData = '暂无数据，点击重试'
					}
				})
			},
			rencaiDetail(item){
				uni.navigateTo({
					url:'/subpages/pages/detail/company_detail?id='+item.id
				})
			},
			getType(type){
				var persontype = ''
				this.researchDirection.forEach(v=>{
					if(v.dictValue == type)
					persontype = v.dictLabel
				})
				return persontype
			},
			getArea(type){
				var persontype = ''
				this.areaData.forEach(v=>{
					if(v.dictValue == type)
					persontype = v.dictLabel
				})
				return persontype
			},
			// 更新order
			updateOrderInfo(index) {
				let _this = this
				if(_this.currentIndex == 0){
					this.cgdjquery.pageNum = 1
					this.memberList = []
					_this.listTechperson()
				}else{
					this.cgzhquery.pageNum = 1
					this.memberList = []
					_this.listTechperson()
				}
			},
			// 滑到底部 加载更多
			scrollToLower() {
				console.log('222')
				let _this = this
				if(_this.memberList.length < _this.total){
					console.log('111')
					_this.query.pageNum = _this.query.pageNum + 1;
					_this.listTechperson();	
					
				}else{
					console.log('333')
					uni.showToast({
						icon:'none',
						title:"没有更多数据"
					})
				}
			},
		}
	}
</script>

<style>
	.no-data {
		width: 100%;
		height: 300rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		font-size: 32rpx;
		margin-top: 100rpx;
	}
	.no-data .no-data-img {
		width: 300rpx;
		height: 268rpx;
	}
	.main_container{
		width: 100vw;
		height: 100vh;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
		background-color: #e3e3e3;
	}
	
	.member_lsit{
		height: fit-content;
		width: 100%;
		padding-top: 1rpx;
		padding-bottom: 1rpx;
		background-color: #e3e3e3;
	}
	
	.video_item {
		height: 125rpx;
		width: 95%;
		padding: 20rpx;
		margin: 20rpx auto;
		border-radius: 10rpx;
		background-color: #fff;
		box-shadow: 5rpx 0rpx 10rpx #e3e3e3;
	}
	
	.video_img {
		margin-top: 25rpx;
		height: 190rpx;
		width: 180rpx;
		border-radius: 50%;
		margin-left: 30rpx;
		float: left;
	}
	
	.video_content {
		width: 90%;
		height: 120rpx;
		margin-left: 15rpx;
	}
	
	.video_title {
		float: left;
		display: -webkit-box;
		font-size: 33rpx;
		font-weight: 700;
		margin-top: 15rpx;
		white-space: nowrap;
		overflow: hidden;
		white-space: nowrap;
		text-overflow:ellipsis;
		-webkit-box-orient: vertical; /*排列方式*/ 
		-webkit-line-clamp: 1; /*显示文本行数(这里控制多少行隐藏)*/
	}
	
	.publicTime {
		float:right;
		font-size: 23rpx;
		color:darkred;
		margin-top: 15rpx;
		
	}
	
	.devideline {
		float: left; 
		height: 0.3rpx;
		 width:100%;
		 background-color: #eeeeee;
		 margin-top: 15rpx;
		 margin-bottom: 15rpx;
	}
</style>